<template>
  <div>
    <h1>{{ msg }}</h1>
    <h2>学生姓名:{{ name }}</h2>
    <h2>年龄:{{ myAge }}</h2>
    <button @click="changeAge">修改年龄</button>
  </div>
</template>

<script>
export default {
  name: 'Student_C',
  data() {
    return {
      msg: '学生组件',
      //如果需要修改父组件传过来的数据,需要在data中定义一个变量,将父组件传过来的数据赋值给这个变量,然后在模板中使用这个变量
      myAge:this.age,
    }
  },
  methods: {
    changeAge() {
      this.myAge = this.myAge + 1;
    }
  },
  // 接收父组件传递过来的数据方式1
  /*  props: {
      name: String,
      age: Number
    },*/
  // 接收父组件传递过来的数据方式2
  // props: ['name', 'age']
  // 接收父组件传递过来的数据方式3
  props: {
    name: {
      // 类型
      type: String,
      // 必传
      required: true
    },
    age: {
      type: Number,
      // 默认值
      default: 18
    }
  }
}
</script>
<style scoped>


</style>